<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>陌陌酒店平台</title>
<!-- Stylesheets -->
<link href="static/css/bootstrap.css" rel="stylesheet">
<link href="static/css/revolution-slider.css" rel="stylesheet">
<link href="static/css/style.css" rel="stylesheet">

<!--Favicon-->
<link rel="shortcut icon" href="static/images/favicon.ico" type="image/x-icon">
<link rel="icon" href="static/images/favicon.ico" type="image/x-icon">

<!-- Responsive -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link href="static/css/responsive.css" rel="stylesheet">
	<script type="text/javascript" src="static/jquery/jquery-2.1.1.min.js"></script>
</head>


<body>
<div class="page-wrapper">

	<header class="header" id="header"></header>
	<script type="text/javascript">
		/*引入Header部分公共代码*/
		//登录成功回显用户信息
		$(function(){
			$("#header").load('header.html',function () {
				$.ajax({
					type:"post",
					url:"getUserBySession",
					contentType: "application/json; charset=utf-8",
					async:false,
					success:function(data){
						console.log(data.username)
						if (data.username ===undefined) {
							//$(".userIcon").text(data.username)
						}else {
							//console.log("ttttttt"+data.username);

							$(".userIcon").text(data.username);
							$(".userReg").css("display","none");
							$(".userLog").text("切换用户");
						}
					},
					error: function (xhr) {
						alert("异常");
					}
				});
			})
		});
	</script>

    <!-- main header area end -->

     <!--Page Title-->
    <section class="page-title text-center">
        <div class="auto-container">
            <div class="content-box">
                <div class="title">房间列表</div>
                <ul class="bread-crumb">
                    <li><a href="index.html">主页<i class="fa fa-angle-right"></i></a></li>
                    <li>房间列表</li>
                </ul>
            </div>
        </div>
    </section>
    <!--End Page Title-->


    <!-- service section -->
    <section class="rooms-list rooms-grid">
    	<div class="container">
    		<div class="row">

				<div id="rooms">
					<!--酒店列表-->
				</div>

    		</div>
    		<ul class="rooms-btn text-center">
    			<li><a href="#"><i class="fa fa-angle-left"></i></a></li>
    			<li class="active"><a href="#">1</a></li>
    			<li><a href="#">2</a></li>
    			<li><a href="#">3</a></li>
    			<li><a href="#">4</a></li>
    			<li><a href="#"><i class="fa fa-angle-right"></i></a></li>
    		</ul>
    	</div>
    </section>
    <!-- service section end -->

	<!--页眉-->
	<div class="footer" id="footer" ></div>
	<script type="text/javascript">
		/*引入Header部分公共代码*/
		$(function(){
			$.ajax({
				type:"get",
				url:"footer.html",
				async:true,
				success:function(data){
					$("#footer").html(data);
				}
			});
		});
	</script>

	<script>
		$(function () {
			$.ajax({
				//提交数据的类型 POST GET
				type:"POST",
				//提交的网址
				url:"hotelDetail1",
				dataType:"json",
				async:false,
				//成功返回之后调用的函数
				contentType:"application/json",
				success:function(returnData){
					$.each(returnData,function (i, value) {
						//获取ID
						var id = value.id;
						//获取房间编号
						var roomId = value.roomID;
						//获取房间类型
						var roomType = value.roomType;
						//获取图片路径（或者是名字）
						var pic = value.pic;
						//获取酒店人均价格
						var roomPrice = value.roomPrice;
						//获取房间描述
						var roomDescribe = value.roomDescribe;
						$("#rooms").append("\n" +
								"                            <div class=\"single-item  wow fadeInLeft animated animated animated\">\n" +
								"                            	<div class=\"row\">\n" +
								"                           		<div class=\"col-md-4 col-sm-6 col-xs-12\">\n" +
								"                           			<div class=\"img-box\">\n" +
								"                                			<a href=\"/selectRoomById?id="+id+"\"><figure><img src=\"static/images/rooms/"+pic+"\" alt=\"\"></figure></a>\n" +
								"                               	 	</div>\n" +
								"                               	 </div>\n" +
								"                                <div class=\"col-md-8 col-sm-8 col-xs-12\">\n" +
								"                               	<div class=\"rooms-content\">\n" +
								"										<a href=\"/selectRoomById?id="+id+"\"><h3>"+roomType + roomId +"</h3></a>\n" +
								"										<div class=\"text\"><span>"+roomPrice+"</span> 元/ 晚</div>\n" +
								"									<ul class=\"rating\">\n" +
								"										<li><i class=\"fa fa-star\" aria-hidden=\"true\"></i></li>\n" +
								"										<li><i class=\"fa fa-star\" aria-hidden=\"true\"></i></li>\n" +
								"										<li><i class=\"fa fa-star\" aria-hidden=\"true\"></i></li>\n" +
								"										<li><i class=\"fa fa-star\" aria-hidden=\"true\"></i></li>\n" +
								"										<li><i class=\"fa fa-star\" aria-hidden=\"true\"></i></li>\n" +
								"									</ul>\n" +
								"									<p>"+roomDescribe+"</p>\n" +
								"									<a href=\"/selectRoomById?id="+id+"\" class=\"btn-one\">现在预约</a>\n" +
								"								</div>\n" +
								"							</div>\n" +
								"						</div>\n" +
								"					</div>\n" +
								"                        ")
					});
				},
				//调用出错执行的函数
				error: function(responseText){
					//请求出错处理
					console.error(responseText);
				}
			});
		})
	</script>
    
</div>
<!--End pagewrapper-->


<!--Scroll to top-->
<div class="scroll-to-top scroll-to-target" data-target=".main-header"><span class="icon fa fa-angle-up"></span></div>



<!-- jQuery js -->

<script src="static/js/map-script.js"></script>
<script type="text/javascript" src="static/js/jquery-2.1.4.js"></script>
<script src="static/js/bootstrap.min.js"></script>
<script src="static/js/jquery.themepunch.tools.min.js"></script>
<script src="static/js/jquery.themepunch.revolution.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.slideanims.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.layeranimation.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.navigation.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.kenburn.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.actions.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.parallax.min.js"></script>
<script type="text/javascript" src="static/js/revolution.extension.migration.min.js"></script>
<script type="text/javascript" src="static/js/jquery.fancybox.pack.js"></script>
<script type="text/javascript" src="static/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="static/js/owl.carousel.min.js"></script>
<script type="text/javascript" src="static/js/jquery.appear.js"></script>
<script type="text/javascript" src="static/js/jquery.countTo.js"></script>
<script src="static/js/isotope.js"></script>
<script src="static/js/jquery.fancybox.pack.js"></script>
<script src="static/js/jquery.fancybox-media.js"></script>
<script src="static/js/owl.js"></script>
<script src="static/js/masterslider.js"></script>
<script type="text/javascript" src="static/js/jquery.polyglot.language.switcher.js"></script>
<script src="static/js/owl.carousel.min.js"></script>
<script type="text/javascript" src="static/js/jquery.mixitup.min.js"></script>
<script src="static/js/validate.js"></script>
<script src="static/js/wow.js"></script>
<script src="static/js/script.js"></script>
<script type="text/javascript" src="static/js/theme.js"></script>

<script src="static/js/timePicker.js"></script>
<script src="static/js/jquery-ui.js"></script>



<!-- End of .page_wrapper -->

</body>
</html>
